<template>
  <div id="updateSignedLesson" class="updateSignedLesson">
	  <h2>编辑课程<span style="float: right"><x-button style="background: gray" mini type="primary" action-type="button" @click.native="onDelete">删除</x-button></span></h2>

	  <group>
		  <cell class="customerCell" title="课程类型" :value="activity_type" is-link @click.native="showPopup=true"></cell>
		  <x-input title="课时" type="number" v-model="points"></x-input>
		  <datetime class="customerCell" title="开始日期" value-text-align="right" v-model="start_date"></datetime>
		  <datetime class="customerCell" title="截止日期" value-text-align="right" v-model="end_date"></datetime>
	  </group>

	  <div v-transfer-dom>
		  <popup v-model="showPopup" class="checker-popup">
			  <div style="padding:10px 10px 40px 10px;">
				  <p style="padding: 5px 5px 5px 2px;color:#888;">课程类型</p>
				  <checker
					  v-model="activity_type"
					  default-item-class="demo4-item"
					  selected-item-class="demo4-item-selected"
					  disabled-item-class="demo4-item-disabled">
					  <checker-item v-for="(item,index) in items" :value="item.value" @on-item-click="onItemClick(item.id)"> {{item.value}} </checker-item>
				  </checker>
			  </div>
		  </popup>
	  </div>

	  <div v-transfer-dom>
		  <confirm v-model="showConfirm"
		           :title="title"
		           @on-cancel="onCancel"
		           @on-confirm="onConfirm"
		           @on-show="onShow"
		           @on-hide="onHide">
			  <p style="text-align:center;">{{ message }}</p>
		  </confirm>
	  </div>

	  <div class="error" v-show="error">{{error}}</div>

	  <div style="text-align: center"><x-button class="buttonCustomer" type="primary" action-type="button" @click.native="updateSignedLesson">确定</x-button></div>
  </div>
</template>

<script>
	import bus from '@/event/eventBus'
	import NetWorking from '../../../../utils/networking'
  import {Confirm, Group, XInput, XButton, Cell, TransferDom, Popup, Checker, CheckerItem, Datetime} from 'vux'
  export default {
    name: "newSignedLesson",
	  directives: {
		  TransferDom
	  },
    components:{
      Group,
      XInput,
      XButton,
      Cell,
	    TransferDom,
	    Checker,
	    CheckerItem,
	    Popup,
	    Datetime,
	    Confirm
    },
    data() {
    	return {
    		id: '',
		    customer_id: this.$route.params.id,
		    showPopup: false,
		    points: 0,
		    activity_type: '',
		    activity_type_id: '',
		    items: [],
		    start_date: '',
		    end_date: '',
		    error: '',
		    showConfirm: false,
		    title: '操作提示',
		    message: '确定删除吗？',
	    }
    },
	  created: function () {
		  bus.$emit("setTopSimpleTitle", '课程编辑')
		  let _this = this

		  var lov_url = 'list_of_value/getListOfValueByType'
		  var signedLesson_url = 'customer_lesson/' + this.$route.params.id
		  var urlarr = new Array()
		  urlarr.push(
			  NetWorking.doGet(
				  lov_url,
				  null,
				  {params: {type: 'S_LOV_LESSON'}}
			  ))

		  urlarr.push(
			  NetWorking.doGet(
				  signedLesson_url,
				  null,
				  null
			  ))

		  var callback = function (c1, c2) {
			  _this.items = c1.data.list_of_value
			  let rs2 = c2.data.customer_lesson

			  _this.id = rs2.id
			  _this.customer_id = rs2.customer_id
			  _this.points = rs2.points
			  _this.start_date = rs2.start_date
			  _this.end_date = rs2.end_date

			  _this.activity_type_id = rs2.lesson_id

			  for(var i=0; i<_this.items.length; i++){
		  		if(_this.items[i].id == _this.activity_type_id){
					  _this.activity_type = _this.items[i].value

				  }
			  }

		  }

		  NetWorking.doAll2(urlarr).then(this.axios.spread(callback))
			  .catch(function (e){
				  console.log(2);
			  });
	  },
	  /*created: function () {
		  let _this = this
		  NetWorking.doGet(
			  'list_of_value/getListOfValueByType',
			  null,
			  {
				  params: {
					  type: 'S_LOV_LESSON'
				  }
			  }
		  ).then(
			  response => {
				  let rs = response.data
				  if(rs.error_code == 0){
					  _this.items = rs.list_of_value
				  }else{
					  alert(rs.error_message)
				  }
			  }
		  )
	  },*/
    methods: {
	    onCancel () {
		    console.log('on cancel')
	    },
	    onConfirm (msg) {
		    this.deleteSignedLesson()
	    },
	    onHide () {
		    console.log('on hide')
	    },
	    onShow () {
		    console.log('on show')
	    },
    	onDelete() {
		    this.showConfirm = true
	    },
	    onItemClick (value) {
		    this.activity_type_id = value

		    if (!this.disabled) {
			    this.showPopup = false
		    }
	    },
	    deleteSignedLesson: function () {
		    let _this = this
		    NetWorking.doDelete(
			    'customer_lesson',
			    null,
			    {
				    params: {
				    	id: this.id
				    }
			    }
		    ).then(
			    response => {
				    let rs = response.data
				    if(rs.error_code == 0){
					    this.$router.push({ name: "customerDetails", params: {id: _this.customer_id}})
				    }else{
					    alert(rs.error_message);
				    }
			    }
		    )
	    },
	    updateSignedLesson: function () {
		    if(this.activity_type_id == ''){
			    this.error = "请确认课程类型是正确的"
			    return
		    }

		    if(this.points <= 0){
			    this.error = "请确认课时数是正确的"
			    return
		    }

		    NetWorking.doPut(
			    'customer_lesson',
			    null,
			    {
			    	id: this.id,
				    customer_id: this.customer_id,
				    lesson_id: this.activity_type_id,
				    points: this.points,
				    start_date: this.start_date,
				    end_date: this.end_date
			    },
			    null
		    ).then(
			    response => {
				    let rs = response.data
				    if(rs.error_code == 0){
					    this.$router.go(-1)
				    }else{
					    alert(rs.error_message)
				    }
			    }
		    )
	    }
    }
  }
</script>

<style>
	.error{
		font-size: 15px;
		color:red;
		text-align: center;
		margin-top: 10px;
	}

  .updateSignedLesson {
    border: solid;
    border-color: #f7f7fa;
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 56px;
    box-shadow: 5px 5px 5px #888888;
    border-radius: 25px;
	  background-color: white;
  }
  .buttonCustomer {
	  width: 50%;
    border-radius: 25px;
	  margin-top: 15px;
	  margin-bottom: 15px;
  }

	.customerCell {
		height: 1.41176471em !important;
		line-height: 1.41176471 !important;
		text-decoration: none;
	}

	.weui-cell__bd {
		text-align: left;
	}
</style>
